<template>
  <div>成绩等级显示</div>
  <p v-if="type=='A'">优秀</p>
  <p v-else-if="type=='B'">良好</p>
  <p v-else-if="type=='C'">中等</p>
  <p v-else-if="type=='D'">及格</p>
  <p v-else>不及格</p>
  <button @click="tran">切换成优秀</button>

  <!-- <button @click="type='B'">切换成良好</button>
  <button @click="type='C'">切换成中等</button>
  <button @click="type='D'">切换成及格</button>
  <button @click="type='E'">切换成不及格</button> -->

</template>
<script setup>
import { ref } from 'vue';
let type =ref('B');
function tran() {
  type.value = "A";
}
</script>

<style>

</style>